<template>
	<view class="pages">
		<web-view src="/hybrid/html/default.html" @message="handlePostMessage"></web-view>
		<view class="content" :style="contentStyle">
			<button @click="play">播放</button>
			<button @click="switchVideo(videoInfo)">切换视频</button>
			<button @click="pause">暂停</button>
			<button @click="speed">倍速</button>
		</view>
	</view>
</template>

<script>
export default {
	props: {
		
	},
	data() {
		return {
			windowInfo: {
				statusBarHeight: 0,
				windowHeight: 0,
				windowWidth: 0,
				trueHeight: 0
			},
			webViewObj: null,
			contentStyle: '',
			videoInfo: {
				videoUrl: 'https://video.dious.cc/20200804/Kqs8liPm/index.m3u8'
			}
		};
	},
	mounted() {
		this.$nextTick(function(){
			this.initWebView();
		})
	},
	onResize(e) {
		console.log(e);
	},
	methods: {
		async switchVideo(videoInfo){
			await this.promise(1300);
			this.webViewObj.evalJS('switchVideo("' + videoInfo.videoUrl + '")');
		},
		async play(){
			await this.promise();
			this.webViewObj.evalJS('play()');
		},
		async pause(){
			await this.promise();
			this.webViewObj.evalJS('pause()');
		},
		async speed(){
			await this.promise();
			this.webViewObj.evalJS('speed(2)');
		},
		handlePostMessage(e) {
			// console.log(e);
		},
		promise(time=0){
			let promise = new Promise((resolve,reject)=>{
				setTimeout(()=>{
					resolve()
				},time)
			})
			return promise
		},
		initWebView() {
			var _this = this;
			const res = uni.getSystemInfoSync();
			_this.windowInfo.statusBarHeight = res.statusBarHeight;
			_this.windowInfo.windowHeight = res.windowHeight;
			_this.windowInfo.trueHeight = _this.windowInfo.windowHeight - _this.windowInfo.statusBarHeight;
			_this.contentStyle = 'z-index:1;position:relative;top: ' + (_this.windowInfo.trueHeight/3.3 + _this.windowInfo.statusBarHeight) + 'px;';
			uni.showLoading({
				title: '解析中...',
				mask: true
			})
			setTimeout(function(){
				let arr = plus.webview.all();
				for(var i=0; i < arr.length; i++){
					let currentWebview = arr[i].getURL();
					if (currentWebview.lastIndexOf('hybrid/html') != -1) {
						_this.webViewObj = plus.webview.getWebviewById( arr[i].id );
						_this.webViewObj.setStyle({
							top: uni.getSystemInfoSync().statusBarHeight + 44,
							height: _this.windowInfo.trueHeight/3.13,
							scrollIndicator: "none",
							position: 'absolute',
							userSelect: false,
							videoFullscreen: 'landscape-primary',
							hardwareAccelerated: true
						});
						break;
					}
				}
				uni.hideLoading()
			}, 1000)
		}
	}
};
</script>

<style lang="scss" scoped>
	.pages {
		background-color: #282C35;
	}
</style>
